import QtQuick 2.0
import QtQuick.Controls 1.2

Rectangle{
    width: 480; height: 320
    color: "black"
    id: root
    Component{
        id: rectDelegate
        Item{
            id: wrapper
            z: PathView.zOrder
            opacity: PathView.itemAplha
            scale: PathView.itemScale
            Rectangle{
                width: 100; height: 60
                color: Qt.rgba(Math.random(), Math.random(), Math.random(), 1)
                border.width: 2
                border.color: wrapper.PathView.isCurrentItem ? "red":"lightgrey"
                Text {
                    anchors.centerIn: parent
                    text: index
                    font{ bold: true; pixelSize: 30; family: "source code pro"}
                    color: Qt.lighter(parent.color, 2)
                }
            }
        }
    }
    PathView{
        id: pathView
        anchors.fill: parent
        interactive: true
        pathItemCount: 7
        preferredHighlightBegin: 0.5
        preferredHighlightEnd: 0.5
        highlightRangeMode: PathView.StrictlyEnforceRange
        delegate: rectDelegate
        model: 15
        path:Path{
            startX: 10; startY: 100
            PathAttribute {name:"zOrder"; value: 0}
            PathAttribute {name:"itemAplha"; value: 0.1}
            PathAttribute {name:"itemScale"; value: 0.6}
            PathLine{ x:root.width/2 - 40; y: 100 }
            PathAttribute {name:"zOrder"; value: 10}
            PathAttribute {name:"itemAplha"; value: 0.8}
            PathAttribute {name:"itemScale"; value: 1.2}
            PathLine{ relativeX: root.width/2-60; relativeY: 0}
            PathAttribute {name:"zOrder"; value: 0}
            PathAttribute {name:"itemAplha"; value: 0.1}
            PathAttribute {name:"itemScale"; value: 0.6}
        }
        focus: true
        Keys.onLeftPressed: decrementCurrentIndex();
        Keys.onRightPressed: incrementCurrentIndex();
    }

}
























